{% extends "blogs/base.html" %}

{% block page_header %}
   <div class="text-center mt-2 mb-2"> <!-- 将元素水平居中 -->
     <h2 class="display-5">Wellcome to regist to blog</h2>
   </div>
{% endblock page_header %}

{% block content %}
  <div class="container mt-5">
    <div class="row justify-content-center">
      <div class="col-md-6">
        <div class="card shadow-sm">
          <div class="card-body">
            <form method="post" action="{% url 'users:register' %}">
              {% csrf_token %}
              {{ form.as_p }}
              <div class="d-grid gap-2"> <!-- 使用 Bootstrap 的网格系统 -->
                <button name="submit" class="btn btn-primary btn-block">Register</button>
              </div>
              <input type="hidden" name="next" value="{% url 'blogs:home' %}" />
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>

{% endblock %}